<template>
	<view>
		<!-- 导航栏组件 -->
		<CustomNavbar />
		<!-- MhgSwiper 组件 -->
		<MhgSwiper />
		<!-- 分类面板 -->
		<CategoryPanel />
		<!-- 推荐内容 -->
		<HotPanel />
		<!-- 猜你喜欢 -->
		<Guess :isLoading="isLoading" @loadDone="changeLoadStatus" />
		<!-- 其他视图内容 -->
		<view class="index-content">
			<!-- 这里是页面的其余内容 -->
		</view>
	</view>
</template>

<script>
	import {
		mapActions
	} from 'vuex';
	// 引入自定义组件
	import CustomNavbar from './components/CustomNavbar.vue';
	import MhgSwiper from './components/MhgSwiper.vue';
	import CategoryPanel from './components/CategoryPanel.vue';
	import HotPanel from './components/HotPanel.vue';
	import Guess from '../../components/Guess.vue';
	export default {
		components: {
			CustomNavbar,
			MhgSwiper,
			CategoryPanel,
			HotPanel,
			Guess
		},
		data() {
			return {
				isLoading: 0
			};
		},
		onReachBottom() {
			this.isLoading = 1
			console.log("触底啦")
		},
		// 页面逻辑和其他内容,
		created() {
			this.getLocation()
		},
		methods: {
			...mapActions('location', ['saveLocation']),
			async getLocation() {
				var location = {};
				try {
					const res = await uni.getLocation({
						type: 'gcj02'
					});
					location = {
						latitude: res.latitude,
						longitude: res.longitude
					}
				} catch (error) {
					// 设置默认数据
					location = {
						latitude: 24.623344,
						longitude: 118.088553
					}
				}
				this.saveLocation(location)
			},
			changeLoadStatus() {
				this.isLoading = 0
			}
		}
	}
</script>

<style lang="scss">
	/* 可以添加页面的样式 */
	page {
		background-color: #FAFAFA;
	}
</style>